<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>服务号接入</title>
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <link rel="stylesheet" type="text/css" href="css/aui.css"/>
    <script src="js/art-template.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="js/wxrem.js" type="text/javascript" charset="utf-8"></script>
    <!--<script src="//s.url.cn/qqun/qun/qqweb/m/qun/confession/js/vconsole.min.js"></script>-->
    <script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        document.writeln("<script type=\"text/javascript\" src=\"js/common.js?" + Math.random() + "\"></scr" + "ipt>");
    </script>

</head>
<style>

    .join_list {
        background: #f5f5f5;
    }

    .join_list div {
        padding: 0 1.5rem;
        height: 6rem;
        margin-bottom: .9rem;
        color: #000000;
        background: #fff;

    }

    .join_list div p {
        float: left;
        line-height: 6rem;
        font-size: 1.5rem;
    }

    .join_list div img {
        float: left;
        margin-right: 1.1rem;
        height: 3.8rem;
        width: 3.8rem;
        border-radius: 50%;
        margin-top: 1.1rem;
    }
    .join_msg_1{
        background: #fff;
        padding: 0 1.5rem 2rem;
        display: none;
    }

    .join_msg{
        background: #fff;
        padding: 0 1.5rem 4rem;
        display: none;
    }
    .join_msg div {
        margin-bottom: 2rem;
        color: #666;
        margin-top: -.5rem;
        padding-left: 1.5rem;
        line-height: 2.5rem;
        font-size: 1.4rem;
    }
    .join_msg_1 div{
        margin-bottom: 1rem;
        color: #666;
        margin-top: -.5rem;
        padding-left: 1.4rem;
        line-height: 2rem;
    }
    .join_msg_1 div{
        line-height: 1.8rem;
        font-size: 1.3rem;
        margin-bottom: 1rem;
        font-weight: bold;
        color: #666;
    }
    .join_msg_1 a{
        font-size: 1.2rem;
        color: #3292ff;
        text-decoration: underline;
        padding-left: 3rem;
        margin-bottom: 1.3rem;
        display: block;
    }
    .join_msg p  {
        padding-left: 1.4rem;
        line-height: 2.5rem;
        color: #3292ff;
        text-decoration: underline;
    }
    .join_msg p img{
        width: 1rem;
        height: 1rem;
        float: left;
        margin-right: .5rem;
        margin-top: .8rem;
    }
    .join_msg_1 p{
        color: #666;
        font-size: 1.3rem;
        font-weight: normal !important;
        padding-left: 1.5rem;
        line-height: 2.5rem;
    }
    .join_msg h3 ,.join_msg_1 h3 {
        background: #fff;
        height: 6rem;
        line-height: 6rem;
        font-size: 1.5rem;
    }
    .nikename,.join_fuwuhao{
        color: black;
    }
    .join_msg span ,.join_msg_1 span{
        display: block;
        height: 1.4rem;
        width: .3rem;
        background: #ec4137;
        float: left;
        margin-right: 1rem;
        line-height: 6rem;
        margin-top:2.3rem ;
    }
    .join_btn{
        width: 90%;
        height: 5rem;
        border-radius: 2.5rem;
        background: #ffd74b;
        font-size: 1.5rem;
        font-weight: bold;
        color: #222222;
        line-height: 5rem;
        text-align: center;
        position: absolute;
        bottom: 6rem;
        left: 50%;
        margin-left: -45%;
    }
    .join_msg_1 h1{
        font-size: 1.2rem;
        color: #d36c70;
        margin-top: 1.2rem;
        padding-left: 1.5rem;
        margin-bottom: 2rem;
    }
    .link{
        margin-top: -1.5rem;
    }
</style>
<body>
<div class="box">
    <div class="join_list">
   <!--     <div>

            <img class="headImgUrl" src="img/fxs_logo1.png" alt="">
            <p class="nikename">名字</p>
        </div>-->
        <div>
            <img class="join_headImgUrl" src="img/fxs_logo.png" alt="">
            <p  class="join_fuwuhao">服务号对接</p>
        </div>
    </div>
  <div class="join_msg">
        <h3> <span></span>功能介绍</h3>
        <div>绑定服务号以后，会引导用户订阅听书，订阅成功后，每日上新书籍将会通过自己的服务号给用户推送消息。</div>
        <p class="p1"> <img src="icon/lvjiantou.png" alt=""> 什么是服务号对接？</p>
        <p class="p2"> <img src="icon/lvjiantou.png" alt=""> 对接后能获得什么能力？</p>
        <p class="p3"> <img src="icon/lvjiantou.png" alt=""> 如何接入服务号？</p>
        <p class="p4"> <img src="icon/lvjiantou.png" alt=""> 如何添加学习计划模板消息提醒？</p>
    </div>

    <div class="join_msg_1">
        <h3><span></span>使用流程：</h3>
        <div>
            <div>1、服务号、订阅号（菜单配置链接）</div>
            <p>复制店铺短链接→打开微信管理后台→自定义菜单→选择菜单→粘贴链接（在页面地址处）</p>
            <h1>*注：每日上新消息推送的功能，只针对服务号接入的用户。</h1>
        </div>
        <div>
            <div>2、微信群</div>
            <p>分享一：复制短链接或二维码→选择微信群或好友→发送</p>
            <p>分享二：复制短链接或二维码→发朋友圈</p>
            <h1>提示：服务号接入成功后，如果不想授权了，可以随时解绑，解绑后消息通知也相应取消</h1>
        </div>
        <!--<a class="link" href="https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=4&sn=f1103e8c850776a3544d5f9821b8106c&chksm=fafcc642cd8b4f54f541fea2ed9c5e1694e10235f74a0e9b79ec66adc5871ad7d0963bd549f1&token=1232300861&lang=zh_CN#rd"> >>具体解绑流程</a>-->
        <a class="link" href="https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=4&sn=19a0be592bf6f18d29965989af214af1&chksm=fafcc641cd8b4f57914b650e4f67c90a06d3911b177656dd6ff009cc215f43fc9018ccadf8ca&token=672158135&lang=zh_CN#rd"> >>具体解绑流程</a>
    </div>
    <div class="join_btn">
        马上接入
    </div>
</div>


</body>
<script>
    var weixinData =  JSON.parse(sessionStorage.getItem('weixinData'));//用户信息
    $('.nikename').text(weixinData.data.nickname)
    $('.headImgUrl').attr('src',weixinData.data.headImgUrl)

    // 授权前检测
    var obj = {token: token, timestamp: date}
    var sign = hex_md5(objKeySort(obj))
    $.ajax({
        type:"get",
        url:hostUrl + 'merchant/check_auth_url/'+ token +'/' + sign + '/'+ date,
        async:true,
        success:function(data) {
            if(!data) return
            if(data.status ==1){
                $('.join_fuwuhao').text(data.message)
                $('.join_btn').click(function () {//服务号接入
                    location.href= hostUrl + "auth/goto_auth_url/h5?openId=" + openId
                })
                $('.join_msg').show()
            }else {
                $('.join_msg_1').show()
                $('.join_btn').hide()
                $('.join_fuwuhao').text(data.data.nickName)
                $('.join_headImgUrl').attr('src',data.data.headImg)


            }
        }
    });


    $('.p1').click(function () {
        location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=1&sn=c910f1cd9c2eeac32862796145dd27b7&chksm=fafcc641cd8b4f5761472e5e2e26ee93d075842f0fdbf6eecc6f7cd290356a647c920ebd3aaa&token=672158135&lang=zh_CN#rd'
        // location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=1&sn=d5e271515d22c152377d04d476cb5ae8&chksm=fafcc642cd8b4f54a0ce92170bff77907fa0d2be436bafcf0f6ce12382feb0a5d46bbe39a7e2&token=1232300861&lang=zh_CN#rd'
    })
    $('.p2').click(function () {
        // location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=1&sn=d5e271515d22c152377d04d476cb5ae8&chksm=fafcc642cd8b4f54a0ce92170bff77907fa0d2be436bafcf0f6ce12382feb0a5d46bbe39a7e2&token=1232300861&lang=zh_CN#rd'
        location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=1&sn=c910f1cd9c2eeac32862796145dd27b7&chksm=fafcc641cd8b4f5761472e5e2e26ee93d075842f0fdbf6eecc6f7cd290356a647c920ebd3aaa&token=672158135&lang=zh_CN#rd'
    })
    $('.p3').click(function () {//如何接入服务号
        // location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=2&sn=fc82e7f17fb0c4079bd99764c42fabfc&chksm=fafcc642cd8b4f543ea783d282d7723c6530888ed444fa4ba7a6daa12be22030715ab8f812b4&token=1232300861&lang=zh_CN#rd'
        location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=2&sn=9bdc478b331360e4aaa2ec2fad55c9e4&chksm=fafcc641cd8b4f57d2298dec6988cc528b1d069b3f51c43f6460d10387fb421d577a47e7f1cc&token=672158135&lang=zh_CN#rd'
    })

    $('.p4').click(function () {//如何添加模板消息
        // location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=3&sn=3b173ccacd1e883d9c5f7a6b218bd4e2&chksm=fafcc642cd8b4f54a9424c4b31c5dde880774fec9e0163e90810a00e59c986daaa8ebc850349&token=1232300861&lang=zh_CN#rd'
        location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=3&sn=2758011ad130f027348f940196ad3117&chksm=fafcc641cd8b4f578ee9c77999088157a26fc7ee6062ba59f59b81df39b54f97d879484cf613&token=672158135&lang=zh_CN#rd'
    })


</script>
</html>